<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Donate today!</title>
    <link rel="icon" href="favicon.svg" />
    <link rel="stylesheet" crossorigin href="./assets/appeal.css">
  </head>
  <body class="grid items-center justify-center overflow-hidden">
    <div
      class="info p-10 grid items-center justify-center max-w-screen-sm overflow-hidden"
    >
      <a
        href="https://www.spyder-ide.org/"
        class="flex justify-center"
      >
        <img src="spyder-logo.svg" class="logo" alt="Spyder IDE" />
      </a>

      <div class="grid-center -mx-5">
        <img
          src="header_donations.svg"
          class="w-full"
          alt="Help Keep Spyder Strong!"
        />
        <div class="heart-container">
          <span class="heart heart-beat"></span>
        </div>
      </div>

      <a
        href="https://www.spyder-ide.org/donate"
        class="button"
        id="donate"
      >
        <img src="icon_donations.svg" alt="Donate!">
      </a>

      <!-- content -->
      <div class="content">
        <p>Spyder is a fully independent project, unaffiliated with Anaconda or
          other companies. As it’s developed by and for
          <em><strong>you</strong></em>, our beloved community, we need
          <em><strong>your</strong></em> support to help keep it moving forward!
          Your donation goes directly to funding Spyder development through <a
          href="https://numfocus.org/">NumFOCUS</a>, a recognized charitable
          organization.</p>
      </div>
    </div>
  </body>
</html>
